import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
import {
  WeaTop,
  WeaLeftTree,
  WeaLeftRightLayout,
  WeaDropMenu,
  WeaRightMenu,
  WeaErrorPage,
  WeaTools,
  WeaLocaleProvider,
} from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;
import { Menu } from 'antd';
import NewsContent from './newsContent';

@inject('newsStore')

@observer
class Main extends React.Component {
  componentDidMount() {
    const { location, newsStore } = this.props;
    const { getOuter, setPublishTypeAndId, init } = newsStore;
    const publishType = location.query.publishType || '1';
    const id = location.query.id || '';
    setPublishTypeAndId(publishType, id, () => {
      init();
    });
  }
  componentWillReceiveProps(nextProps) {
    const { location, newsStore } = nextProps;
    const { getOuter, setPublishTypeAndId, init } = newsStore;
    const publishType = location.query.publishType || '1';
    const id = location.query.id || '';
    setPublishTypeAndId(publishType, id, () => {
      init();
    });
  }
  componentWillUnmount() {
  }

  selectMenu = (arg) => {
    const { getList, setState } = this.props.newsStore;
    setState({ isDetail: false, selectedKeys: [arg.key] });
    getList({ id: arg.key });
  }
  render() {
    const { outerDatas: { companyName, newsList }
      , selectedKeys, publishType } = this.props.newsStore;
    return (
      <div className="wea-doc-news">
        <div className={`news-left ${publishType != '0' && 'displayNone'}`}>
          <div className="news-left-title">{companyName}</div>
          <div className="news-left-menu">
            <Menu ecId={`${this && this.props && this.props.ecId || ''}_Menu@40atv7`}
              style={{ width: 256 }}
              selectedKeys={toJS(selectedKeys)}
              onClick={this.selectMenu}
            >
              {
                toJS(newsList).length !== 0 && toJS(newsList).map(v => <Menu.Item ecId={`${this && this.props && this.props.ecId || ''}_undefined@qx2mgf@${v.name}`} key={v.id}>{v.name}</Menu.Item>)
              }
            </Menu>
          </div>
        </div>
        <div className={`news-right ${publishType == '0' && 'paddingLeft178'}`}>
          <NewsContent ecId={`${this && this.props && this.props.ecId || ''}_NewsContent@v4xto2`} />
        </div>
      </div>
    );
  }
}

export default WeaTools.tryCatch(React,
  props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@tc1isk`} msg={props.error ? props.error : getLabel(385218, '对不起，该页面异常，请联系管理员！')} />,
  { error: '' },
)(Main);

